
    <h2>DateBox Buttons</h2>
    <p>This example shows how to customize the datebox buttons underneath the calendar.</p>
    <div style="margin:20px 0;"></div>
    <div class="easyui-panel" style="width:100%;max-width:400px;padding:30px 60px;">
        <div style="margin-bottom:20px">
            <label class="label-top">Date With 2 Buttons:</label>
            <input class="easyui-datebox" style="width:100%;height:26px">
        </div>
        <div style="margin-bottom:20px">
            <label class="label-top">Date With 3 Buttons:</label>
            <input class="easyui-datebox" data-options="buttons:buttons" style="width:100%;height:26px">
        </div>
    </div>
    <script>
        var buttons = $.extend([], $.fn.datebox.defaults.buttons);
        buttons.splice(1, 0, {
            text: 'MyBtn',
            handler: function(target){
                alert('click MyBtn');
            }
        });
    </script>
